var treeId = '#topic-tree';
var topicTree = null;

$(document).ready(function () {
	// init topic treeview
	topicTree = new TreeView(treeId);
	topicTree.collapseAll();
	topicTree.onSelectChange = function (item) {
		/* load topic's content when click on treeview item */
		$('.loading').show();
		ajax(
			'read', 
			getTopicId(item.element.attr('id')), 
			function (result) {
				$("#viewport").html(result.content);
				$('.loading').hide();
			}
		);
	};
	
	var menu = new Menu('#cmenu');

	// init splitter
	$(".main").splitter({
		type: "v",
		sizeLeft: 200,
		cookie: "vsplitter"
	});
});

/* Menu class */
Menu = function(menuId) {
	this.setup(menuId);
}

Menu.prototype = {
	setup: function(menuId) {
		// show menu when rclick tree item
		$('.col-left').bind("contextmenu",function(e){
			e.preventDefault();
			$(menuId)
				.show()
				.css({
					'top': e.clientY + 'px',
					'left': e.clientX + 'px',
				});
			// hide menu after 5s
			window.setTimeout(function () { $(menuId).hide(); }, 5000);
		});

		// hide menu when click in menu item
		$(menuId).find('.item').click(function () { $(menuId).hide(); });
		$('#cmdEdit').click(this.onEdit);
		$('#cmdDel').click(this.onDelete);
		$('#cmdAddChild').click(this.onAddChild);
		$('#cmdAddRoot').click(this.onAddRoot);
	},
	
	/* Delete selected topic */
	onDelete: function () {
		var item = topicTree.getSelect();
		if (!item) return;
		// confirm?
		var topicId = getTopicId(item.element.attr('id'));
		// showLoading
		ajax(
			'delete', 
			topicId, 
			function (result) {
				if (result) {
					item.remove();
					// add success message
				} else {
					// add failed message
				}
				// hideLoading
				// show result message
			}
		);	
	},

	/* Show edit topic form */
	onEdit: function () {
		var item = topicTree.getSelect();
		if (!item) return;
		// editForm { name, content, parent selector }
		// editForm.show
		// editForm.onSubmit -> updateTopic, update Treeview, update ViewContent
		// editForm.onCancel -> editForm.hide
	},

	/* Show add topic form (root) */
	onAddRoot: function () {
		var item = topicTree.getSelect();
		if (!item) return;
		// editForm.show
		// editForm.onSubmit -> updateTopic, update Treeview, update ViewContent
		// editForm.onCancel -> editForm.hide
	},

	/* Show add topic form */
	onAddChild: function () {
		var item = topicTree.getSelect();
		if (!item) return;
		// editForm.show
		// editForm.onSubmit -> updateTopic, update Treeview, update ViewContent
		// editForm.onCancel -> editForm.hide
	}
}

/* TopicForm class */
TopicForm = function(formId) {
	this.setup(formId);
}

TopicForm.prototype = {
	setup: function(formId) {
	},
	
	/* Delete selected topic */
	onSubmit: function () {
	},

	/* Show edit topic form */
	onCancel: function () {
	},

	/* Show add topic form (root) */
	show: function () {
	}

}

//////////////////////////////////////////////////
// MISC
//////////////////////////////////////////////////

/* Get topic id by treeview item's id */
function getTopicId(itemId) {
	return itemId.replace('topic-', '');
}

/* Get treeview item's id by topic id */
function getItemId(topicId) {
	return 'topic-' + topicId;
}

/* Perform ajax post */
function ajax(method, arg, callback) {
	$.ajax({
		async: true,
		url: 'ajax.php',
		type: "POST",
		data: JSON.stringify({ method: method, arg: arg }),
		dataType: 'json',
		contentType:"application/jsonrequest",
		success: callback
	});
}
